import React, {Component} from "react";

export default class TaskItem extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        let style = {
            textDecoration: this.props.task.completed ? 'line-through' : 'none',
            cursor: this.props.task.completed ? 'default' : 'pointer',
            color: this.props.task.actived ? "green" : "black"
        };
        return (
            <li style={{borderBottom: "1px solid black", padding: "5px"}}>
    <button onClick={this.props.onDel.bind(this, this.props.task)}>删除</button>
        &nbsp;
    <span style={style}
        onClick={this.props.onFinish.bind(this, this.props.task)}>{this.props.task.text}</span>
        </li>
    );
    }
}